<template>
    <div v-loading="loading" class="menu">
        <div class="menu-top">
            <p>模型列表</p>
            <!--            <el-input v-model="title" placeholder="请输入关键词"></el-input>-->
            <!--            <el-button size="small" type="primary" @click="GetSearch()">搜索</el-button>-->
            <!--            <el-button plain size="small" @click="GetResetting()">重置</el-button>-->
        </div>
        <div class="menu-add">
            <el-button icon="el-icon-plus" size="small" type="primary" @click="AddManager()">添加</el-button>
        </div>
        <div class="menu-center">
            <el-table :data="tableData">
                <el-table-column label="账号" prop="username">

                </el-table-column>
                <el-table-column label="权限" prop="role">

                </el-table-column>
                <el-table-column label="最后登录时间" prop="last_login_time">

                </el-table-column>
                <el-table-column label="登录ip" prop="last_login_ip">

                </el-table-column>
                <el-table-column label="状态" prop="status" sortable>
                    <template slot-scope="scope">
                        <el-tag v-if="scope.row.status == 1">正常</el-tag>
                        <el-tag v-else type="danger">禁用</el-tag>
                    </template>
                </el-table-column>
                <el-table-column label="操作" prop="status" sortable width="300">
                    <template slot-scope="scope">
                        <el-button icon="el-icon-edit" size="mini" type="primary" @click="UpdateManager(scope.row)">修改
                        </el-button>
                        <el-button v-if="scope.row.roleid !=1" icon="el-icon-delete" size="mini" type="danger"
                                   @click="DeleteManager(scope.row)">删除
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>

            <div class="pages">
                <el-pagination :current-page="currentpage"
                               :page-size="num"
                               :total="total"
                               background
                               layout="prev, pager, next"
                               @current-change="handleCurrentChange">
                </el-pagination>
            </div>
        </div>
        <router-view></router-view>
    </div>
</template>

<script>
export default {
    name: "MangerIndex",
    data() {
        return {
            title: "",
            tableData: [],
            total: 1,
            page: 1,
            num: 10,
            currentpage: 1,
            loading: true,
            editData: {}
        }
    },
    mounted() {

        this.initPageData()
        this.loading = false
    },
    methods: {
        // 修改
        UpdateManager(item) {
            this.$router.push('/model/edit?id=' + item.id)
        },
        // 删除
        DeleteManager(item) {
            this.$Msg.openConfirm('确定要删除吗？', 'warning', () => {
                this.loading = true
                this.$http.HttpGet("v1/DeleteManager?id=" + item.id).then((res) => {
                    if (res.code == 0) {
                        this.$Msg.message(res.msg)
                        setTimeout(() => {
                            this.loading = false
                            // this.$router.go(0)
                            this.initPageData()
                        }, 150)
                    } else {
                        this.$Msg.message(res.msg, 'error')
                        this.loading = false
                    }
                })

            }, () => {
                // Msg.message('退', 'error')
            })
        },
        // 搜索
        GetSearch() {
            this.initPageData()
        },

        // 分页
        handleCurrentChange(v) {
            this.page = v
            this.currentpage = v
            this.initPageData()
        },

        // 重置
        GetResetting() {
            this.title = ''

        },
        //初始化数据
        initPageData() {
            let data = {
                page: this.page,
                num: this.num,
                title: this.title
            }

            this.$http.HttpPost("v1/GetMangerList", data).then((res) => {
                this.dialogVisibleAdd = false
                this.dialogVisibleEdit = false
                if (res.code == 0) {
                    this.tableData = res.data

                    this.total = res.count
                } else {
                    this.$Msg.message(res.msg)
                }


            })
        },

        // 添加
        AddManager() {
            this.$router.push('/model/add')
        },

        handleClose(done) {
            done()
        }
    }
}
</script>

<style scoped>
.menu-top {
    width: 100%;
    display: flex;
    height: 50px;
    align-items: center;
}

.menu-top p {
    /*width: 100px;*/
    font-size: 16px;
    font-weight: 700;
    color: #666;
    text-align: center;
    margin: 0 10px;
    padding-left: 0;
}


.menu-add {
    margin: 15px 0;
}

.menu-center .title {
    display: flex;
    /*justify-content: center;*/
    align-items: center;
    cursor: pointer;
}
</style>
